<template>
    <div class="index-box">
        <cesiumMap style="width: 100%; height: 100%;" :idName="idName" :regionSet="regionSet" :pointSet="pointSet">
        </cesiumMap>
        <el-button type="primary" plain style="position: absolute; top: 10px; left: 10px;"
            @click="flightRouteSimulation">模拟航线</el-button>
    </div>
</template>
<script setup lang="ts">
import { ref, onMounted, watch } from 'vue';
import cesiumMap from '@/components/cesium/index.vue';
const idName = ref<string>('indexCesium');
const regionSet = ref<any[]>([
    [104.89206093039736, 37.537514389192424],
    [104.89350031458932, 37.53752395668732],
    [104.89349462900537, 37.54114277688587],
    [104.89201254362075, 37.541146725944785],
    [104.89201828553256, 37.54093106790035],
    [104.89198017369218, 37.53974007289316],
    [104.89206093039736, 37.537514389192424]
]);
const pointSet = ref<any[]>([
]);
const textPoint = ref<any[]>([
    [104.89206093039736, 37.537514389192424],
    [104.89350031458932, 37.53752395668732],
    [104.89349462900537, 37.54114277688587],
    [104.89201254362075, 37.541146725944785],
    [104.89201828553256, 37.54093106790035],
    [104.89198017369218, 37.53974007289316],
    [104.89206093039736, 37.537514389192424],
    [104.89349462900537, 37.54114277688587],
]);
const textIndex = ref<number>(0);
const flightRouteSimulation = () => {
    if(textIndex.value > 7) return;
    pointSet.value.push(textPoint.value[textIndex.value]);  
    textIndex.value += 1;
    console.log(pointSet.value)
};
onMounted(() => { })
</script>

<style lang="scss" scoped>
.index-box {
    width: 100%;
    height: calc(100vh - 60px);
    overflow: hidden;
    position: relative;
}
</style>
